<div class="layui-fluid nepadmin-pad0 nepadmin-mar0 list0"  lay-title="消费记录">
    <div class="layui-fluid">
        <div class="layui-row layui-col-space15">
            <div class="layui-col-md12">
                <div class="layui-card layui-tab layui-tab-brief" style="margin: 0;">
                    <ul class="layui-tab-title">
                        <li class="layui-this" value="1" click_num="1">校园使用记录</li>
                        <li value="2" click_num="1">校园包月记录</li>
                        <li value="3" click_num="1">酒店包时记录</li>

                    </ul>
                    <div class="layui-card-body layui-tab-content hxr-card-body" style="padding: 15px;">
                        <div class="layui-tab-item layui-show" id="bonusset">
                            <div class="layui-card hxr-layui-card" id="memberlistv1">
                                <div class="layui-form layui-card-header hxradmin-card-header">
                                    <div class="layui-form-item">
                                        <div class="layui-inline">
                                            <label class="layui-form-label">关键词查询</label>
                                            <div class="layui-input-inline">
                                                <input type="text" name="user" placeholder="请输入会员姓名、设备id" autocomplete="off" class="layui-input">
                                            </div>
                                        </div>
                                        <div class="layui-inline">
                                            <label class="layui-form-label" style='width:100px;'>消费结束日期范围</label>
                                            <div class="layui-input-inline" style="width: 350px;    ">
                                                <input type="text" name="val2" id='date1' placeholder="请选择日期" autocomplete="off" class="layui-input" readonly>
                                            </div>
                                        </div>
                                        <div class="layui-inline">
                                            <button class="layui-btn" data-type="reload" id="search1">搜索</button>
                                        </div>
                                        <div class="layui-inline">
                                            <button class="layui-btn" data-type="excel" id="pexcel1">导出数据</button>
                                        </div>
                                    </div>
                                </div>
                                <div class="layui-card-body">
                                    <table class="layui-hide" id="list-select-table1" lay-filter="list-select-table1"></table>

                                </div>

                            </div>
                        </div>
                        <div class="layui-tab-item">
                            <div class="layui-card hxr-layui-card" id="memberlistv2">
                                <div class="layui-form hxradmin-card-header">
                                    <div class="layui-form-item">
                                        <div class="layui-inline">
                                            <label class="layui-form-label">会员姓名</label>
                                            <div class="layui-input-inline">
                                                <input type="text" name="user" placeholder="输入会员姓名" autocomplete="off" class="layui-input">
                                            </div>
                                        </div>

                                        <div class="layui-inline">
                                            <label class="layui-form-label" style='width:85px;'>开始日期范围</label>
                                            <div class="layui-input-inline">
                                                <input type="text" name="val2" id='date2' placeholder="请选择日期" autocomplete="off" class="layui-input">
                                            </div>
                                        </div>
                                        <div class="layui-inline">
                                            <label class="layui-form-label">支付状态</label>
                                            <div class="layui-input-inline">
                                                <div class="layui-unselect layui-form-select">
                                                    <div class="layui-select-title"><input name="status" type="text" value="" placeholder="选择支付状态" readonly class="layui-input layui-unselect"><i
                                                            class="layui-edge"></i></div>
                                                    <dl class="layui-anim layui-anim-upbit" style="">
                                                        <dd lay-value="" class="layui-select-tips layui-this">选择状态</dd>
                                                        <dd data='2'>已支付</dd>
                                                        <dd data='1'>未支付</dd>
                                                    </dl>
                                                </div>
                                            </div>
                                        </div>
                                        <div class="layui-inline">
                                            <button class="layui-btn" data-type="reload" id="search2">搜索</button>
                                        </div>
                                    </div>
                                </div>
                                <div class="layui-card-body">
                                    <table class="layui-hide" id="list-select-table2" lay-filter="list-select-table2"></table>

                                </div>
                            </div>
                            <script type="text/html" id="pay_status">
                                {{#  if(d.status === 2){ }}
                                <span class="layui-badge layui-bg-green">已支付</span>
                                {{#  } else if(d.status === 1) { }}
                                <span class="layui-badge">未支付</span>
                                {{#   } }}
                            </script>
                            <script type="text/html" id="is_calculation">
                                {{#  if(d.is_calculation === 1){ }}
                                <span class="layui-badge layui-bg-green">未结算</span>
                                {{#  } else if(d.is_calculation === 2) { }}
                                <span class="layui-badge">已结算</span>
                                {{#   } else if(d.is_calculation === 3) { }}
                                <span class="layui-badge layui-bg-blue">已作废</span>
                                {{#   } }}
                            </script>
                        </div>
                        <div class="layui-tab-item">
                            <div class="layui-card hxr-layui-card" id="memberlistv">
                                <div class="layui-form hxradmin-card-header">

                                    <div class="layui-form-item">
                                        <div class="layui-inline">
                                            <label class="layui-form-label">关键字</label>
                                            <div class="layui-input-inline">
                                                <input type="text" name="user"  style="width: 220px" placeholder="会员姓名、设备id、代理用户名
" autocomplete="off" class="layui-input">
                                            </div>
                                        </div>
                                        <div class="layui-inline">
                                            <label class="layui-form-label" style='width:85px;'>日期范围</label>
                                            <div class="layui-input-inline">
                                                <input type="text" name="val3" id='date3' placeholder="请选择日期" autocomplete="off" class="layui-input">
                                            </div>
                                        </div>
                                        <div class="layui-inline">
                                            <label class="layui-form-label">支付状态</label>
                                            <div class="layui-input-inline">
                                                <div class="layui-unselect layui-form-select">
                                                    <div class="layui-select-title"><input name="status" type="text" value="" placeholder="选择支付状态" readonly class="layui-input layui-unselect"><i
                                                            class="layui-edge"></i></div>
                                                    <dl class="layui-anim layui-anim-upbit" style="">
                                                        <dd lay-value="" class="layui-select-tips layui-this">选择状态</dd>
                                                        <dd data='2'>已支付</dd>
                                                        <dd data='1'>未支付</dd>
                                                    </dl>
                                                </div>
                                            </div>
                                        </div>
                                        <div class="layui-inline">
                                            <button class="layui-btn" data-type="reload" id="search3">搜索</button>
                                        </div>
                                    </div>
                                </div>
                                <div class="layui-card-body">
                                    <table class="layui-hide" id="list-select-table3" lay-filter="list-select-table3"></table>

                                </div>
                            </div>

                        </div>
                    </div>


                </div>
            </div>
        </div>
    </div>
</div>
</div>
<style type="text/css">
    #drawingsset .layui-form-label{
        width: 150px;
    }

    #break_set .layui-form-label{
        width: 150px;
    }
    #commission .layui-form-label{
        width: 150px;
    }
    #benefit .layui-form-label{
        width: 150px;
    }
    #applets .layui-form-label{
        width: 150px;
    }
    #opens .layui-form-label{
        width: 150px;
    }
    #drawset .layui-form-label{
        width: 150px;
    }
    #recharge .layui-form-label{
        width: 150px;
    }
    #rechargeset .layui-btn-danger{
        display: inline-block !important;
    }

</style>
<script>
        layui.use(['table', 'form','laydate','element'], function() {

            var table = layui.table,
                form = layui.form,
                $ = layui.$,laydate=layui.laydate,
                element = layui.element;
            //日期范围
            laydate.render({
                elem: '#date1'
                ,type:'datetime'
                ,range: '~'
                ,done: function(value, date, endDate){
                    $('.layui-show input[name="val2"]').val(value);
                }

            });
            layui.admin.initlist(table,'members/consume_record_list',240,[
                [{
                    type: 'checkbox'
                },{
                    field: 'consume_record_id',
                    title: 'ID',
                    width: 60
                },{
                    field: 'device_name',
                    title: '设备名称',
                    width: 100
                },{
                    field: 'device_id',
                    title: '设备id',
                    width: 100
                },{
                    field: 'real_name',
                    title: '会员姓名',
                    width: 100
                },{
                    field: 'consume_amount',
                    title: '消费总金额(元)',
                    width: 110
                },{
                    field: 'cash_amount',
                    title: '非赠送金额(元)',
                    width: 140
                },{
                    field: 'credit_amount',
                    title: '赠送金额(元)',
                    width: 110
                },{
                    field: 'valid_time',
                    title: '扣费时间',
                    width: 150
                },{
                    field: 'invalid_time',
                    title: '免费时间',
                    width: 150
                },{
                    field: 'start_time',
                    title: '开始时间',
                    width: 200
                },{
                    field: 'end_time',
                    title: '结束时间',
                    width: 200
                },{
                    field: 'count_time',
                    title: '消费总时',
                    width: 150
                },
                    {
                        field:'agent_name',
                        title:'代理',
                        width:120
                    },

                    {
                        field: 'agent_income',
                        title: '代理佣金(元)',
                        width: 110
                    },{
                    field:'income_name',
                    title:'分红会员',
                    width:120
                },{
                    field: 'member_income',
                    title: '会员分红(元)',
                    width: 110
                },{
                    field: 'activity',
                    title: '备注',
                    width: 200
                }]
            ],'#list-select-table1');
            //操作dom
            $('.layui-btn.layuiadmin-btn-list').on('click', function() {
                var type = $(this).data('type');
                active[type] ? active[type].call(this) : '';
            });
            //搜索
            $('#search1').on('click', function() {
                var val1 = $('input[name="user"]'),
                    val2 = $('input[name="val2"]').val();
                if (val2){
                    var datemin=val2.split('~')[0],datemax=val2.split('~')[1];
                }else{
                    var datemin='',datemax='';
                }
                //执行重载
                table.reload('list-select-table1', {
                    page: {
                        curr: 1 //重新从第 1 页开始
                    },
                    where: {
                        search_text: val1.val(),
                        datemin:datemin,
                        datemax:datemax
                    }
                });
            });
            //导出
            $('#pexcel1').on('click', function() {
                var val1 = $('.layui-show input[name="user"]'),
                    val2 = $('.layui-show input[name="val2"]').val();
                if (val2){
                    var datemin=val2.split('~')[0],datemax=val2.split('~')[1];
                }else{
                    var datemin='',datemax='';
                }
                layui.admin.excel(table,'members/consume_record_list',
                    {
                        search_text: val1.val(),
                        datemin:datemin,
                        datemax:datemax
                    },'','list-select-table1');
            });

        element.on('tab()', function(){
            var item_val=$(this).attr('value');
            if ($(this).attr('click_num')!=1) return false;
            $(this).attr('click_num',2);
            if (item_val==1){//

            }else if (item_val==2){//
                laydate.render({
                    elem: '.layui-show  #date2'
                    ,type:'datetime'
                    ,done: function(value, date, endDate){
                        $('.layui-show  input[name="val2"]').val(value);
                        // console.log(value); //得到日期生成的值，如：2017-08-18
                        // console.log(date); //得到日期时间对象：{year: 2017, month: 8, date: 18, hours: 0, minutes: 0, seconds: 0}
                        // console.log(endDate); //得结束的日期时间对象，开启范围选择（range: true）才会返回。对象成员同上。
                    }
                    ,range: '~'
                });
                layui.admin.initlist(table,'members/charter_list',240,[
                    [{
                        field: 'charter_id',
                        title: 'ID',
                        width: 60
                    },{
                        field: 'real_name',
                        title: '会员姓名',
                        minwidth: 100
                    },{
                        field: 'charter_time',
                        title: '包机时间（天）',
                        width: 100
                    },{
                        field: 'price_total',
                        title: '包机总金额(元)',
                        width: 110
                    },{
                        field: 'balance',
                        title: '余额扣款(元)',
                        width: 110
                    },{
                        field: 'credit_amount',
                        title: '赠送余额扣款（元）',
                        width: 150
                    },{
                        field: 'cash',
                        title: '现金扣款（元）',
                        width: 150
                    },{
                        field: 'status',
                        title: '支付状态',
                        width: 150,
                        templet:'#pay_status'
                    },{
                        field: 'start_time',
                        title: '开始时间',
                        width: 180,
                    },{
                        field: 'end_time',
                        title: '结束时间',
                        width: 180,

                    },{
                        field: 'pay_time',
                        title: '支付时间',
                        width: 200
                    },{
                        field: 'old_charter',
                        title: '说明',
                        width: 200
                    },{
                        field: 'agent_income',
                        title: '佣金（元）',
                        width: 200
                    },{
                        field: 'withdraw_proportion',
                        title: '佣金比例（%）',
                        width: 200
                    },{
                        field: 'create_time',
                        title: '创建时间',
                        width: 200
                    },{
                        field: 'is_calculation',
                        title: '状态',
                        width: 200,
                        templet:'#is_calculation'
                    }]
                ],'#list-select-table2');
                $('#search2').on('click', function() {
                    var val1 = $('.layui-show input[name="user"]').val(),
                        val2 = $('.layui-show input[name="val2"]').val(),
                        type = $('.layui-show input[name="type"]').val(),
                        status = $('.layui-show input[name="status"]').attr('data');
                    table.reload('list-select-table2', {
                        page: {
                            curr: 1 //重新从第 1 页开始
                        },
                        where: {
                            search_text:val1,
                            datemin:val2.split('~')[0],
                            datemax:val2.split('~')[1],
                            type:type,
                            status:status
                        }
                    });
                });
            }else if (item_val==3){//分红设置
                laydate.render({
                    elem: '.layui-show  #date3'
                    ,type:'datetime'
                    ,done: function(value, date, endDate){
                        $('.layui-show  input[name="val3"]').val(value);
                        // console.log(value); //得到日期生成的值，如：2017-08-18
                        // console.log(date); //得到日期时间对象：{year: 2017, month: 8, date: 18, hours: 0, minutes: 0, seconds: 0}
                        // console.log(endDate); //得结束的日期时间对象，开启范围选择（range: true）才会返回。对象成员同上。
                    }
                    ,range: '~'
                });
                layui.admin.initlist(table,'members/hotel_list',240,[
                    [{
                        field: 'hotel_use_id',
                        title: 'ID',
                        width: 80
                    },{
                        field: 'device_id',
                        title: '设备id',
                        width: 80
                    },{
                        field: 'use_time',
                        title: '包时(h)',
                        width: 100
                    },{
                        field: 'real_name',
                        title: '会员姓名',
                        width: 100
                    },{
                        field: 'user_money',
                        title: '现金金额(元)',
                        width: 110
                    },{
                        field: 'credit_money',
                        title: '赠送金额(元)',
                        width: 110
                    },{
                        field: 'wechat_money',
                        title: '微信支付(元)',
                        width: 110
                    },{
                        field: 'status',
                        title: '支付状态',
                        width: 150,
                        templet:'#pay_status'
                    },{
                        field: 'pay_time',
                        title: '支付时间',
                        width: 200
                    },{
                        field: 'agent_name',
                        title: '代理',
                        width: 120
                    },{
                        field: 'agent_income',
                        title: '佣金（元）',
                        width: 180
                    },{
                        field: 'withdraw_proportion',
                        title: '佣金比例（%）',
                        width: 180
                    },{
                        field: 'create_time',
                        title: '创建时间',
                        width: 200
                    }]
                ],'#list-select-table3');
            }
            $('#search3').on('click', function() {
                var status = $('.layui-show input[name="status"]').attr('data');
                var search_text = $('.layui-show input[name="user"]').val();
                val2 = $('.layui-show input[name="val3"]').val(),
                table.reload('list-select-table3', {
                    page: {
                        curr: 1 //重新从第 1 页开始
                    },
                    where: {
                        status:status,
                        search_text:search_text,
                        datemin:val2.split('~')[0],
                        datemax:val2.split('~')[1],
                    }
                });
            });
        });
    })
</script>